<!--
 * @Descripttion: 
 * @Version: 1.0
 * @Author: wcl
 * @Date: 2023-11-24 14:56:49
 * @LastEditors: wcl
 * @LastEditTime: 2023-11-24 15:12:01
-->
<template>
  <div>
    <a-modal
      v-model:open="modalOpen"
      title="售后原因"
      width="50%"
      :footer="null"
    >
      <a-space direction="vertical" style="width: 100%" :size="16">
        <a-form
          :model="formData"
          ref="formRef"
          labelAlign="left"
          :label-col="{ span: 3 }"
          :wrapper-col="{ span: 21 }"
        >
          <a-form-item
            label="售后名称"
            name="content"
            :rules="[{ required: true, message: '输入售后名称' }]"
          >
            <a-textarea
              v-model:value="formData.content"
              placeholder="输入售后名称"
            />
          </a-form-item>
          <a-form-item
            label="展示排序"
            name="sort"
            :rules="[{ required: true, message: '输入展示排序' }]"
          >
            <a-input
              v-model:value="formData.sort"
              placeholder="输入排序数字序号"
            />
          </a-form-item>
          <a-form-item
            label="状态"
            name="state"
            :rules="[{ required: true, message: '请选择状态' }]"
          >
            <a-select
              ref="select"
              v-model:value="formData.state"
              placeholder="请选择状态"
            >
              <a-select-option :value="1">启用</a-select-option>
              <a-select-option :value="2">禁用</a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item :wrapper-col="{ offset: 9, span: 4 }">
            <div class="btns center">
              <a-space>
                <a-button @click="handleCloseDialog">取消</a-button>
                <a-button type="primary" @click="handleSubmit">确定</a-button>
              </a-space>
            </div>
          </a-form-item>
        </a-form>
      </a-space>
    </a-modal>
  </div>
</template>
<script setup>
import { ref } from "vue";
import { saveReturnReason } from "@/api/sysConfig";
const modalOpen = ref(false);
const formData = ref({});
const formRef = ref(null);
const open = (record) => {
  modalOpen.value = true;
  formData.value = record;
  if(!formData.value.type){
    formData.value.type = 1;
  }
};
function handleCloseDialog() {
  modalOpen.value = false;
  formData.value = {};
  formRef.value.resetFields();
}

const emits = defineEmits(["refreshList"]);
function handleSubmit() {
  formRef.value.validate().then(() => {
    saveReturnReason(formData.value).then((res) => {
      if (res.code === 200) {
        handleCloseDialog();
        emits("refreshList");
      }
    });
  });
}
defineExpose({ modalOpen, open });
</script>
